<template>
  <div>
    <el-row>
      <el-col :offset="4" :span="16">
<!--        轮播图-->
        <Carousel />
<!--        电脑软件推荐-->
        <el-row class="myRow">
          <el-card style="text-align: left">
            <div slot="header">
              <span style="font-size: 24px">电脑软件推荐</span>
            </div>
            <div style="text-align: center">
              <div v-for="file in datas1" :key="file.id" style="display: inline-block; height: 150px; width: 120px; margin: 20px">
                <a :href="file.fileUrl" style="text-decoration: none; color: #303133">
                  <img :src="file.fileIcon" width="100%" height="80%">
                  <span style="font-size: 18px">{{file.nickName}}</span>
                </a>
              </div>
            </div>
          </el-card>
        </el-row>
<!--        安卓软件推荐-->
        <el-row class="myRow">
          <el-card style="text-align: left">
            <div slot="header">
              <span style="font-size: 24px">安卓软件推荐</span>
            </div>
            <div style="text-align: center">
              <div v-for="file in datas2" :key="file.id" style="display: inline-block; height: 150px; width: 120px; margin: 20px">
                <a :href="file.fileUrl" style="text-decoration: none; color: #303133">
                  <img :src="file.fileIcon" width="100%" height="80%">
                  <span style="font-size: 18px">{{file.nickName}}</span>
                </a>
              </div>
            </div>
          </el-card>
        </el-row>
<!--        合作伙伴-->
        <el-row class="myRow">
          <el-card style="text-align: center">
            <div>
              合作伙伴
            </div>
          </el-card>
        </el-row>
      </el-col>
    </el-row>
    <template>
      <div>
        <el-backtop></el-backtop>
      </div>
    </template>
  </div>
</template>

<script>
import Carousel from "@/components/Carousel";
export default {
  name: "Home",
  components: {Carousel},
  data() {
    return {
      datas1: [],
      datas2: []
    }
  },
  created() {
    this.loadData1();
  },
  methods: {
    loadData1() {
      this.request.get("/u/pageByType", {
        params: {
          pageNum: 1,
          pageSize: 12,
          fileType: "电脑软件"
        }
      }).then(res => {
        if (res.code == 200) {
          this.datas1 = res.data.records;
        }
        this.loadData2()
      });
    },
    loadData2() {
      this.request.get("/u/pageByType", {
        params: {
          pageNum: 1,
          pageSize: 12,
          fileType: "安卓软件"
        }
      }).then(res => {
        if (res.code == 200) {
          this.datas2 = res.data.records;
        }
      });
    }
  }
}
</script>

<style scoped>
.myRow {
  margin-bottom: 10px
}
</style>
